<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head >     
        <title>Settings</title>
        <link href="css/meteocal.css" rel="stylesheet" type="text/css"/>
    </h:head>
    <h:body class="noFrame">      
        <!--Element of the first line on the top bar-->
        <div id="topHeader">
            <img id="logo" src="Images/meteocalsnow.png"  name="meteocalLogo" title="meteocallogo"/>
            <h1 id="userCalendar">#{loginBean.loggedUser.username}'s Calendar</h1>  

            <div class="logoutForm">         
                <h:form id="logout">
                    <p:commandButton id="logoutButton" value="Logout" action="#{loginBean.logout()}"/>                     
                </h:form>
            </div>
        </div>

        <div id="searchHeader">
            <h:form id="search">
                <p:inputText id="searchText" value="#{SearchController.searchedUser}" />
                <p:commandButton id="searchButton" value="Search"  action="#{SearchController.searchUser()}"/>    
            </h:form>   
        </div>
        
        <div id="LeftHeader">
            <ul class="buttonList">
                <h:form>
                    <li><p:commandButton class="leftBarButton"  value="Home" action="#{scheduleController.loadOwnCalendar()}"/></li>   
                    <li><p:commandButton class="leftBarButton"  value="AddEvent" action="#{EventController.newEvent}"/></li>     
                    <li><p:button class="leftBarButton"  value="Notifications" outcome="notifications"/></li>   
                    <li><p:button class="leftBarButton"  value="Settings" outcome="settings"/> </li> 
                </h:form>
            </ul>
        </div>


        
            <h:form id="settingsForm">
                <p:messages autoUpdate="true" closable="true" showIcon="false" style="width: 85%"/>
                <p:panel style="border: none;width: 94%">
                    <h:panelGrid id="searchGridHeader" columns="3" >
                        <f:facet name="header">
                            Settings
                            <br/>
                            <br/>
                        </f:facet>

                        <p:column>
                            <h:outputLabel for="email" value="New Email: "/> 
                            <p:selectBooleanCheckbox value="#{settingsController.setNewEmail}">
                                <p:ajax update="email"/>
                            </p:selectBooleanCheckbox>
                        </p:column>

                        <p:inputText id="email" value="#{settingsController.user.email}" disabled="#{!settingsController.setNewEmail}" placeholder="example@info.it" >
                            <f:validateRegex pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$" />
                        </p:inputText>
                        <p:message for="email" />

                        <p:column>
                            <h:outputLabel for="pwd1" value="New Password:    " /> 
                            <p:selectBooleanCheckbox value="#{settingsController.setNewPassword}">
                                <p:ajax update="pwd1,pwd2"/>
                            </p:selectBooleanCheckbox>
                        </p:column>
                        <p:password id="pwd1" value="#{settingsController.user.password}" match="pwd2" feedback="true" disabled="#{!settingsController.setNewPassword}" >
                            <f:validateLength minimum="5"/>
                        </p:password>
                        <p:message for="pwd1" />

                        <h:outputLabel for="pwd2" value="Repeat New Password: " />
                        <p:password id="pwd2" value="#{settingsController.user.password}" disabled="#{!settingsController.setNewPassword}"/>
                        <p:message for="pwd2" />


                        <p:outputLabel for="privacy" value="Privacy: " />
                        <p:selectOneRadio id="privacy" value="#{settingsController.privacy}"      >
                            <p:ajax update="shared"/>
                            <f:selectItem itemLabel="Private" itemValue="PRIVATE" />
                            <f:selectItem itemLabel="Shared" itemValue="SHARED" />
                            <f:selectItem itemLabel="Public" itemValue="PUBLIC" />
                        </p:selectOneRadio>
                        <p:inputTextarea placeholder="Example: user1; user2; user3; " value="#{settingsController.sharedUsersString}" id="shared" disabled="#{!settingsController.setSharedPrivacy}" rows="4" cols="35" />


                        <p:outputLabel for="oldPassword" value="Old Password:" />                   
                        <p:password id="oldPassword" value="#{settingsController.oldPassword}"  required="true" requiredMessage="Insert old password" />
                        <p:message for="oldPassword" />

                        <p:commandButton value="Save Settings" ajax="true" action="#{settingsController.updateSettings()}" update="wrongPassword" validateClient="true"  style="margin-right:10px"  />
                    </h:panelGrid>
                </p:panel>
                <p:dialog id="wrongPassword" header="Error" widgetVar="wrongPassword" minHeight="40" resizable="false" >
                    <h:outputText value="Wrong OldPassowrd inserted" />
                </p:dialog>
                <p:dialog id="wrongUsername" header="Error" widgetVar="wrongUsername" minHeight="40" resizable="false" >
                    <h:outputText value="Wrong username inserted in shared list" />
                </p:dialog>
                <p:dialog header="Error" widgetVar="emailError" minHeight="40" resizable="false" >
                    <h:outputText value="E-Mail Already used" />
                </p:dialog>

            </h:form>

    </h:body>
</html>
